<%@ page language="java" contentType="text/html; charset=UTF-8"
         pageEncoding="UTF-8" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<%
    String ctx = request.getContextPath();
    request.setAttribute("ctx", ctx);
%>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>Bootstrap</title>
    <link rel="stylesheet" href="${ctx}/bootstrap/bootstrap.css">

</head>
<body>
<a href="${ctx}/aayuyue.do" class="btn btn-default">我的预约</a>
<div class="container" style="margin-top: 30px">
    <div class="row clearfix">
        <div class="col-md-12 column">
            <div class="form-inline">
                <form>
                    <input type="hidden" name="pageNum">
                   <select name="kid" onchange="fenye(1)">
                       <option value="">请选择</option>
                       <c:forEach items="${list}" var="var">
                       <option value="${var.kid}">${var.kname}</option>
                       </c:forEach>
                   </select>
                </form>
            </div>
            <table class="table table-bordered">
                <thead>
                <tr>
                    <th>
                        编号
                    </th>
                    <th>
                        医生
                    </th>
                    <th>
                        科室
                    </th>
                    <th>
                        编辑
                    </th>
                </tr>
                </thead>
                <tbody>
                <c:forEach items="${pageInfo.list}" var="var" varStatus="vs">
                <tr>
                    <td>
                      ${vs.index+pageInfo.startRow}
                    </td>
                    <td>
                        ${var.dname}
                    </td>
                    <td>
                            ${var.kname}
                    </td>
                    <td>
                        <a href="##" onclick="yuyue(${var.did})">预约</a>
                    </td>
                </tr>
                </c:forEach>
                </tbody>
            </table>
            <ul class="pagination">
                <li>
                    <a href="#" onclick="fenye(1)">首页</a>
                </li>
                <li>
                    <a href="#" onclick="fenye(${pageInfo.prePage})">上一页</a>
                </li>
                <li>
                    <a href="#" onclick="fenye(${pageInfo.nextPage})">下一页</a>
                </li>
                <li>
                    <a href="#" onclick="fenye(${pageInfo.pages})">尾页</a>
                </li>
                <li>
                    <span>共${pageInfo.total}条数据</span>
                </li>
            </ul>
        </div>
    </div>
</div>

<script src="${ctx}/bootstrap/jquery-1.9.1.min.js"></script>
<script src="${ctx}/bootstrap/bootstrap.js"></script>
<script>
    $('[name="kid"]').val("${kid}")
    function fenye(pageNum) {
        $("[name='pageNum']").val(pageNum);
        $("form").submit();
    }
    function yuyue(did) {
        $.post("${ctx}/yuyue.do?did="+did,function (res) {
            if(res){
                alert("成功")
            }else {
                alert("失败")
            }
        })
    }
</script>
</body>
</html>